<template>
	<div>
		<div class="main">
			<!-- 头部组件 -->
			<!-- <div class="navtop flexRow">
				
				<div class="top flexRow">
					<div class="back" @click="goback"></div>
					<div class="title1">{{this.$route.query.label}}</div>
					<div class="empt"></div>
				</div>

			</div> -->
			<Top :Label="this.$route.query.label" ></Top>
			
			<div class="components">
                <!-- home -->
				<DR v-if="this.$route.query.name=='DR'"></DR>
				<ML v-if="this.$route.query.name=='ML'"></ML>
				<MR v-if="this.$route.query.name=='MR'"></MR>
				<MV v-if="this.$route.query.name=='MV'"></MV>
				<RL :BgmUrl="RLbgmData"  v-if="this.$route.query.name=='RL'"></RL>
				<!-- mine -->
				<HM v-if="this.$route.query.name=='HM'"></HM>
				<PF v-if="this.$route.query.name=='PF'"></PF>
				<PR v-if="this.$route.query.name=='PR'"></PR>
				<SM v-if="this.$route.query.name=='SM'"></SM>
				<DM v-if="this.$route.query.name=='DM'"></DM>

			</div>

		</div>

	</div>
</template>

<script>
	//数据data
	import IconsData from './Icons.js'
	//top
	import Top from '../Top.vue'
	// home
	import DR from '../../views/Home/Iconsitems/dailyRec.vue'
	import ML from '../../views/Home/Iconsitems/musicList.vue'
	import MR from '../../views/Home/Iconsitems/musicRecord.vue'
	import MV from '../../views/Home/Iconsitems/musicVideo.vue'
	import RL from '../../views/Home/Iconsitems/rankingList.vue'
	//mine
	import HM from '../../views/Mine/iconsitems/hotmusic.vue'
	import PF from '../../views/Mine/iconsitems/privateFM.vue'
	import PR from '../../views/Mine/iconsitems/privateRe.vue'
	import SM from '../../views/Mine/iconsitems/sleepModel.vue'
	import DM from '../../views/Mine/iconsitems/driverModel.vue'
	//video
	export default {
		components: {
			Top,
			DR,ML,MV,MR,RL,
			HM,PF,PR,SM,DM,
			
		

		},
		
		name: "IconNav",
		data() {
			return {
				RLbgmData:[]
			}
		},
		created() {
			
		},
		mounted() {
			this.RLbgmData = IconsData[0].icons[2].children[0].url
			
			
		},
		methods: {
			
			
		}
	}
</script>

<style>
	
	.title1 {
		z-index: 7;
		width: 100%;
		height: 19px;
		margin-top: 0;
		font-size: larger;
		color: white;

	}

	.back {
		z-index: 6;
		width: 9px;
		height: 16px;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/ps9k8csqmnonwsiy03zoyt6p97jz3arhly5910b6a32-dd13-4bd6-930c-c9d95c998b65) 0px -1px no-repeat;

	}

	.empt {
		width: 9px;
		height: 16px;
	}

	.top {
		justify-content: space-between;
		width: 335px;
		margin: 0 20px;
	}

	.navtop {
		z-index: 5;
		height: 72px;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/psc6ncskwb208e8bae78a9knokp8x3nq4fbd716d3a-ad2c-4255-b906-d661f2d88dd1) -1px -1px no-repeat;
		width: 375px;

		align-items: center;

	}
</style>
